// import { useUserStoreHook } from '@/store/modules/user';
import { Directive, DirectiveBinding } from 'vue';

/**
 * 按钮权限
 */
export const hasPerm: Directive = {
  // mounted(el: HTMLElement, binding: DirectiveBinding) {
  //   // 「超级管理员」拥有所有的按钮权限
  //   const { roles, perms } = useUserStoreHook();
  //   if (roles.includes('ROOT')) {
  //     return true;
  //   }
  //   // 「其他角色」按钮权限校验
  //   const { value } = binding;
  //   if (value) {
  //     const requiredPerms = value; // DOM绑定需要的按钮权限标识

  //     const hasPerm = perms?.some(perm => {
  //       return requiredPerms.includes(perm);
  //     });

  //     if (!hasPerm) {
  //       el.parentNode && el.parentNode.removeChild(el);
  //     }
  //   } else {
  //     throw new Error(
  //       "need perms! Like v-has-perm=\"['sys:user:add','sys:user:edit']\""
  //     );
  //   }
  // }
};
// 组件使用例子
// <el-button v-hasPerm="['sys:user:add']">新增</el-button>
// <el-button v-hasPerm="['sys:user:delete']">删除</el-button>